<template>
  <div class=''>
    <el-descriptions :column="1" border>
      <el-descriptions-item label="容量">1.5TB</el-descriptions-item>
      <el-descriptions-item label="最近更新时间">2024-09-04</el-descriptions-item>
      <el-descriptions-item label="操作">
        <el-button type="primary" size="default" @click="emptyimglist()">清空</el-button>
      </el-descriptions-item>
    </el-descriptions>
    <el-table :data="mulutabledata" border stripe height="300">
      <el-table-column type="index" width="70" label="序号" />
      <el-table-column prop="dirpath" label="路径"> </el-table-column>
      <el-table-column prop="jindu" label="进度"> </el-table-column>
      <el-table-column prop="daxiao" label="大小"> </el-table-column>
      <el-table-column prop="caozuo" label="操作">
        <template #default="scope">
          <el-button type="" size="small" @click="showtif(scope.row)">移除</el-button>
          <!-- <el-button type="" size="small" @click="showtif(scope.row)">重新扫描</el-button> -->
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script setup>

import { ref, defineProps, defineEmits } from 'vue';
import { apiList } from "@/api/apiList";
import { ElMessage } from 'element-plus';

const emits = defineEmits(["update:showMuluDialog", 'ploadData']);

loadData()

function loadData(){
  apiList.getdirlist().then(res => {
    console.log(res)
    mulutabledata.value = res.data
  })
}

function emptyimglist(params) {
  apiList.emptyimglist().then(res => {
    console.log(11111);
    emits('update:showMuluDialog',false)
    emits('ploadData')
    console.log(11111);
    loadData()
    ElMessage.success("清空成功")
  })
  
}

let mulutabledata = ref([
]);


</script>
<style lang='scss' scoped>
</style>